<template>
  <section>
    <XdoTabs class="dc-tab" v-model="tabName" :animated="false" type="card">
      <XdoTabPane name="dcBillListXwtTab" v-if="showBody" label="表体">
        <DcBillListXwt ref="dcBillListXwtTab" :head-id="headId" :billListNo="billListNo" :status="status" :gMark="gMark" :rotateApplyNo="rotateApplyNo" :tradeMode="tradeMode" :declareType="declareType" :emsNo="emsNo" :operation-status="editConfig.editStatus"></DcBillListXwt>
      </XdoTabPane>
      <XdoTabPane name="dcBillHeadXwtTab" label="表头">
        <DcBillHeadXwt ref="dcBillHeadXwtTab" @onEditBack="editBack" :edit-config="editConfig"></DcBillHeadXwt>
      </XdoTabPane>
      <template v-slot:extra>
        <XdoButton type="text" title="返回列表页面" @click="editBack" icon="ios-undo" size="small"></XdoButton>
      </template>
    </XdoTabs>
  </section>
</template>
<script>
import { jx_bill_testUri } from '@/api'
import { editStatus } from '../../jx_bill_test-common/constant'
import DcBillListXwt from '../../xwManageList/dcBillListXwt/DcBillListXwtList'
import DcBillHeadXwt from '../dcBillHeadXwt/DcBillHeadXwtEdit'
export default {
  name: 'DcBillHeadXwtTabs',
  components: {
    DcBillListXwt,
    DcBillHeadXwt
  },
  props: {
    editConfig: {type: Object, default: () => ({})},
  },
  data() {
    return {
      tabName:'dcBillHeadXwtTab',
      tabs: {
        dcBillListXwtTab:false,
        dcBillHeadXwtTab:true,
      },
      showBody: false,
      headId: '',
      gMark:'',
      emsNo:'',
      rotateApplyNo:'',
      declareType:'',
      tradeMode:'',
      billListNo:'',
      status:''
    }
  },
  mounted: function () {
    if (this.editConfig && this.editConfig.editStatus === editStatus.ADD) {
      this.headId = ''
      this.emsNo=this.editConfig.emsNo
      this.status=this.editConfig.status
      this.gMark=this.editConfig.gMark
      this.rotateApplyNo=this.editConfig.rotateApplyNo
      this.declareType=this.editConfig.declareType
      this.tradeMode=this.editConfig.tradeMode
      this.billListNo=this.editConfig.billListNo
      this.showBody = false
    } else if (this.editConfig && this.editConfig.editStatus === editStatus.EDIT) {
      this.headId = this.editConfig.headId
      this.status=this.editConfig.status
      this.emsNo=this.editConfig.emsNo
      this.gMark=this.editConfig.gMark
      this.rotateApplyNo=this.editConfig.rotateApplyNo
      this.declareType=this.editConfig.declareType
      this.tradeMode=this.editConfig.tradeMode
      this.billListNo=this.editConfig.billListNo
      this.showBody = true
    } else if (this.editConfig && this.editConfig.editStatus === editStatus.SHOW) {
      this.headId = this.editConfig.headId
      this.showBody = true
    }
  },
  methods: {
    editBack(val) {
      if (val) {
        this.$emit('onEditBack', true)
      }
    },
  },
  watch: {
    tabName(value) {
      for(let t in this.tabs) {
        this.tabs[t] = false
      }
      this.tabs[value] = true
    }
  }
}
</script>
<style lang="less" scoped>
</style>
